<template>
  <Head title="通知信息" isBack>
    <template #content>
      <Detail
        :columns="1"
        :form="detailForm"
        :detail="data.detailData"
        :labelWidth="80"
        align="left"
      ></Detail>
    </template>
  </Head>
</template>

<script lang="ts" setup>
import Head from '@/components/head/index.vue';
import Detail from '@/components/form/detail.vue';
import { queryNoticeDetail } from '@/service/apis/market';
import { NOTICE_METHOD, NOTICE_OBJECT } from '@/utils/dictionaries';

const route = useRoute();
const {
  query: { id },
} = route;

const detailForm = reactive([
  {
    label: '通知标题',
    prop: 'noticeTitle',
  },
  {
    label: '通知内容',
    prop: 'noticeContent',
    comName: 'textarea',
  },
  {
    label: '发送时间',
    prop: 'sendingTime',
  },
  {
    label: '发送方式',
    prop: 'sendingMethod',
    dic: NOTICE_METHOD,
    comName: 'radio',
  },
  {
    label: '发送对象',
    prop: 'sendingObject',
    dic: NOTICE_OBJECT,
    comName: 'radio',
  },
]);
const data = reactive({
  detailData: {} as any,
});
queryNoticeDetail({ id: id }).then((res: any) => {
  data.detailData = res;

  // 用户树
  if (res.sendingObject === '1') {
    detailForm.push({
      label: '',
      prop: 'arrayList',
      comName: 'tree',
      dic: res.arrayList,
    });
  } else if (res.sendingObject === '2') {
    detailForm.push({
      label: '',
      prop: 'targetIds',
      comName: 'textarea',
    });
  }
});
</script>